<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Loading...</title>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>

    <style>


        body {
            overflow: hidden;
            font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "MicrosoftYaHei", "WenQuanYi Micro Hei", sans-serif;

        }

        .loading {
            background-color: #FFF;
            width: 100%;
            display: fixed;
        }

        .loading img {
            display: block;
            min-height: 209px;
            min-width: 200px;
        }


    </style>
</head>
<body>
<div class="loading">
    <img src="./img/loading.gif" alt="Loading">
    <div style="text-align: center;margin-top: 50px;font-size: large;color: #5f4d43">Loading...</div>
</div>

<!--<div class="mouse original"></div>-->
<script>
    $(".loading").height($(window).height());
    $(".loading").width($(window).width());


    $(".loading img").css({
        paddingTop: ($(".loading").height() - $(".loading img").height()) / 2,
        paddingLeft: ($(".loading").width() - $(".loading img").width()) / 2
    });

    $(window).resize(function () {

        "use strict";

        $(".loading").height($(window).height());
        $(".loading").width($(window).width());


        $(".loading img").css({
            paddingTop: ($(".loading").height() - $(".loading img").height()) / 2,
            paddingLeft: ($(".loading").width() - $(".loading img").width()) / 2
        });

    });

    //
    // $("body").on("click", function (e) {
    //
    //     "use strict";
    //
    //     $(".original").clone(true).appendTo("body").css({
    //         left: e.pageX - 16,
    //         top: e.pageY - 16
    //     }).removeClass("original");
    //
    // });

</script>
</body>
</html>